import React from 'react'
import { useHistory } from 'react-router-dom'
// ================================================================ Image
import Bcimg from '@img/knowledge/bcimg.png'
/* --------------------------- View --------------------------- */
const List = ({name,label,model,onClick,value,type,bool,tips}) =>{
	return(
		<div className='fxm bbor1 lh22 g6 ' >
			<h6>{name}</h6>
			<div className='ex ml5 h'>
				{
					type ==='select'?
					<select placeholder='请输入' type='select' className='w h50' defaultValue={String(value)} style={{paddingLeft:'85%',border:0,outline:'none',background:'transparent'}} onChange={(e)=>{
						model.current[label] = e.target.value
					}}>
						<option className='tr' style={{direction:'ltr'}} value='0'>男</option>
						<option className='tr' style={{direction:'ltr'}} value='1'>女</option>
					</select>
					:<input placeholder={tips} className='w tr h50' readOnly={bool}  defaultValue={value} onChange={(e)=>{
						model.current[label] = e.target.value
						onClick?.(e.target.value)
					}} />
				}
			</div>
		</div>
	)
}
const Index = ( ) => {
	const model = React.useRef({
		sex:'0',
	})
	const [ ajax, setAjax ] = React.useState({ data:{} })
	const [ key, setKey ] = React.useState( 0 )
	const param = window.$fn.query()
	const history = useHistory( )
	React.useEffect(()=>{
		const test = window.$fn.query()
		model.current.spec_code = param.spec_code
		window.$http.pull(setAjax,'ReserveInfo.index',{ param:{test:'eyJpdiI6ImxEaGVQTlUyM3RYWXFOR2FiTHhhSFE9PSIsInZhbHVlIjoiSUVQR1Y1SW1MbEZmdzNKVnA4QlVRUT09IiwibWFjIjoiNzZlYzJlNWExMzQwMTVlZDVjMTE3NTY4MzJjZWJiMzdjOWE0MDU1NDE0NmZkMzNmZDlmYTlhZWJiODk3NDBlNCJ9'}, loading:true }).then(data=>{
			if(data){
				model.current.patient_name = data.patient_name
				model.current.sex = data.sex ?? '1'
				model.current.age = data.age
				model.current.patient_phone = data.patient_phone
				model.current.spec_code = data.spec_code
				model.current.id = data.id
				model.current.collect_sn = data.collect_sn
				model.current.email = data.email
				setKey(key=>key + 1)
			}
		})
	},[history])
	return (
		<>
			<div className='wh plr10 fv' style={{background:`url(${Bcimg}) no-repeat top center/100%`, paddingTop:'42%'}}>
				<div className='ex rel'>
					<div className='abs_full bcf r8px p10 oys' key={key}>
						<List name='条码号' model={model} label='spec_code' bool={true} value={ajax.data?.spec_code} />
						<List name='姓名' tips='请输入' model={model} label='patient_name' value={ajax.data?.patient_name} />
						<List name='性别' tips='请输入' model={model} label='sex' type='select' value={ajax.data?.sex} />
						<List name='手机号' tips='请输入' model={model} label='patient_phone' value={ajax.data?.patient_phone} />
						<List name='年龄' tips='请输入' model={model} label='age' value={ajax.data?.age} />
						<List name='邮箱' tips='请输入' model={model} label='email' value={ajax.data?.email} />
					</div>
				</div>
				<div className='fxmc ptb15'>
					<button className='cf bcm r8px h40 f15' style={{width:'120px'}} onClick={()=>{
						window.$http.post(null,'ReserveInfo.edit',{param:model.current,loading:true}).then(()=>{
							window.$fn.toast('保存信息成功')
							history.push(`/ewm?spec_code=${model.current.spec_code}`)
						})
					}}>确定</button>
					<button className='cf bcm r8px h40 f15 ml20' style={{width:'120px'}} onClick={()=>{
						model.current = {}
						setKey(key=>key + 1)
					}}>重置</button>
				</div>
			</div>
		</>
	)
}
export default Index